import { createWebHashHistory, createRouter } from 'vue-router'

import NProgress from 'nprogress'
import 'nprogress/nprogress.css'

import HomeView from '../views/HomeView.vue'
import ListView from '../views/ListView.vue'
import DetailView from '../views/DetailView.vue'
import ArticleView from '../views/ArticleView.vue'

const routes = [
  // 路由重定向
  { path: '/', redirect: '/home' },
  { path: '/home', component: HomeView },
  { path: '/list', component: ListView },
  { path: '/detail', component: DetailView },
  // 路由参数
  { path: '/article/:id', component: ArticleView },
]

const router = createRouter({
  // 路由模式
  history: createWebHashHistory(),
  // 路由配置项
  routes,
})

NProgress.configure({ showSpinner: false })
// 全局前守卫
router.beforeEach((to, from) => {
  // 作用：1. 验证权限！！！！！ 2.网页跳转进度条 。。。
  NProgress.start()
  console.log('前守卫')
})
// 全局后守卫
router.afterEach((to, from) => {
  NProgress.done()
  console.log('后守卫')
})

export default router
